<%@taglib prefix="s" uri="/struts-tags"%>

<script type="text/javascript" charset="utf-8"
	src="js/jquery.listnav.min-2.1.js"></script>
<script type="text/javascript" charset="utf-8"
	src="js/jquery.dataTables.listnav.js"></script>
	
		
	
<script type="text/javascript" charset="utf-8">


	var arr;
	$.ajax({
		url : 'checkNameGOR.action',
		success : function(data) {
			console.log(data.listId[2]);
			arr= data.listId;
		}
	});

	$(document).ready(function() {
		
		var oTable = $('.dataTable').dataTable({
			"sDom" : 'Zlfrtip',
			"sPaginationType" : "bootstrap"
		//"sPaginationType": "full_numbers"
		});
		
		// Hide column name
		$(".hideTable").hide();
		$(".box").click(function(){
			$(".hideTable").hide();	
		});
		$(".dataTables_paginate ").click(function(){
			$(".hideTable").hide();	
		});
		$("#DataTables_Table_0").click(function(){
			$(".hideTable").hide();	
		}); 
		
		
		$('.dataTables_length select').attr("class", "uniform");
		
		// Active
		$('#check-active').click(function() {
		    var other = $('#check-active:checked').val();
		    if (other != undefined) {
		    	oTable.fnFilter("",4 , true, false);
		    }
		    else {
		    	oTable.fnFilter("Yes",4 , true, false);
		    }
	  	});
		
		// Show form Create New
		$("#btnCreate").click(function(){
			$("#pageCreate").load("pages/createGOR.jsp");
			$("#txt1").hide();
		});
		
		
	});
</script>

<style type="text/css">
.dataTables_filter {
	display: none;
}

.dataTables_length {
	display: none;
}

.dataTables_paginate {
	display: inline;
}
</style>
<s:if test="#session.logged != 'true'">
	<jsp:forward page="../index.jsp" />
</s:if>


<div id="pageCreate"> </div>
<div class="container-fluid" id="txt1">
	<div class="content">
		<div class="box">
			<div class="box-head tabs">
				<h3>Government Office Region</h3>
			</div>
			<div style="background-color:  #F3F3F3;"> 
				<input type="button" id="btnCreate" class="btn btn-success pl_start btn-small" value="Create" style="margin-left: 10px;margin-top: 4px;margin-bottom: 4px; id='btnCreate' ">
			</div>
			
			<div align="right" style="margin-right: 10px; float: right;">  <label class="checkbox"><input type="checkbox" class='uniform' name="active" checked='checked' id="check-active">Include in-active</label> </div>
			
			<div class="box-content box-nomargin" id="tblList">
				<div class="tab-content">
					<div class="tab-pane active" id="basic">
						<table
							class='table table-striped dataTable table-bordered display'>
							<thead>
								<tr>
									<th class="hideTable"> Hide </th>
									<th>Name</th>
									<th>Description</th>
									<th>Country</th>
									<th>Active</th>
									<th width="120">Action</th>
								</tr>
							</thead>
							<tbody>
								<s:iterator value="listGOR" status="stat" var="gor">
									<tr class="odd_gradeX">
										<td class="hideTable"> <s:property value="#gor.GovernmentOfficeRegionName" /> 
										</td>
									
										<td > <p class="hideTable"> <s:property value="%{#gor.GovernmentOfficeRegionName}"/> </p>
										 <s:if test="#gor.active">
												<a href="viewGOR.action?idGOR=<s:property value="%{#gor.id}"/>" 
														>
													<s:property value="#gor.GovernmentOfficeRegionName" />
												</a>
											</s:if> <s:else>
												<a href="#myModals<s:property value="%{#gor.id}"/>" data-toggle="modal"
												> 
													 <s:property
														value="#gor.GovernmentOfficeRegionName" /></a>

											</s:else></td>
										<td><s:property value="#gor.Description" /></td>
										<td><s:property value="#gor.Country" /></td>
										<td><s:if test="#gor.active">Yes</s:if> <s:else>No</s:else></td>

										<td><a id="btnView"
											href="viewGOR.action?idGOR=<s:property value="%{#gor.id}"/>">
												<button id="a<s:property value="%{#gor.id}"/>"
													class="btn btn-success pl_start btn-small btnView"
													value=<s:property value="%{#gor.id}"/>>View</button>
										</a> <a class="btn btn-primary" data-toggle="modal"
											href="#myModal<s:property value="%{#gor.id}"/>">Popup</a> <!-- Popup View -->
											<div class="modal hide"
												id="myModal<s:property value="%{#gor.id}"/>">
												<div class="modal-header">
													<button type="button" class="close" data-dismiss="modal">x</button>
													<h3>Government Office Region Details</h3>
												</div>
												<div class="modal-body">
													<table>
														<tr>
															<td width="300">Id</td>
															<td width="400"><s:property value="#gor.id" /></td>
														</tr>
														<tr>
															<td>Government Office Region Name</td>
															<td><s:property
																	value="#gor.GovernmentOfficeRegionName" /></td>
														</tr>
														<tr>
															<td>Description</td>
															<td><s:property value="#gor.Description" /></td>
														</tr>
														<tr>
															<td>Country</td>
															<td><s:property value="#gor.Country" /></td>
														</tr>
													</table>
												</div>
												<div class="modal-footer">
													<a href="#" class="btn btn-primary" data-dismiss="modal">Close</a>
												</div>
											</div>

					<!-------------------- Popup modal  ----------------------->
					
											<div class="modal hide"
												id="myModals<s:property value="%{#gor.id}"/>">

												<!-- <form action="changeActive" class="btn btn-primary"
														data-dismiss="modal"> -->
												<div class="modal-footer">
													<a
														href="changeActive.action?idGOR=<s:property value="%{#gor.id}"/>">Yes</a>
													<input type="hidden" name="idE"
														value="<s:property value="%{#gor.id}"/>">
												</div>
												<div class="modal-footer">
													<a href="#" class="btn btn-primary" data-dismiss="modal">No</a>
												</div>
											</div></td>
									</tr>
								</s:iterator>
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>		
	</div>
</div>






